<!DOCTYPE HTML>
<html ng-app="skiApp">
<head>
	<meta charset="utf-8">
	<title>Lahti Ski Games</title>

	<!-- Twitter Bootstrap -->
	<link rel="stylesheet" type="text/css" href="assets/libs/bootstrap/css/bootstrap.css" />
	<link rel="stylesheet" type="text/css" href="assets/libs/bootstrap/css/bootstrap-theme.css" />

    <!-- Custom CSS files -->
    <link rel="stylesheet" type="text/css" href="assets/css/main.css" />
	
</head>
<body>
<div class="container-fluid">
    <!-- Top navigation bar -->
    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="offcanvas">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
        </div>
    </div>
    <br>
    <br>
    <br>
    <!-- Sliding navigation bar -->
    <div class="container">
        <div class="row-offcanvas row-offcanvas-left sidebar-offcanvas">
            <a href="#/"><div class="col-menu">
                <img src="assets/img/FPPH.jpg" class="img-sidebar img-responsive center-block" alt="sidebar" id="menu-1">
            </div></a>
			
            <a href="#/program"><div class="col-menu">
                <img src="assets/img/FPPH.jpg" class="img-sidebar img-responsive center-block" alt="sidebar" id="menu-2">
            </div></a>
			
            <a href="#/race-facts"><div class="col-menu">
                <img src="assets/img/FPPH.jpg" class="img-sidebar img-responsive center-block" alt="sidebar" id="menu-3">
            </div></a>
			
            <a href="#/food-and-drink"><div class="col-menu">
                <img src="assets/img/FPPH.jpg" class="img-sidebar img-responsive center-block" alt="sidebar" id="menu-4">
            </div></a>
			
            <a href="#/some"><div class="col-menu">
                <img src="assets/img/FPPH.jpg" class="img-sidebar img-responsive center-block" alt="sidebar" id="menu-5">
            </div></a>
			
            <a href="#/tickets"><div class="col-menu">
                <img src="assets/img/FPPH.jpg" class="img-sidebar img-responsive center-block" alt="sidebar" id="menu-6">
            </div></a>
			
            <a href="#/info"><div class="col-menu">
                <img src="assets/img/FPPH.jpg" class="img-sidebar img-responsive center-block" alt="sidebar" id="menu-6">
            </div></a>
        </div>
    </div>


    <div ng-view ng-swipe-right="showMenu()">
        <!-- Changing content gets injected here -->
	</div>
</div>


<!-- Scripts -->

<!-- jQuery -->
<script src="assets/libs/jquery/jquery-1.11.1.js"></script>

<!-- AngularJS -->
<script src="assets/libs/angularjs/angular.js"></script>
<script src="assets/libs/angularjs/angular-route.js"></script>
<script src="assets/libs/angularjs/angular-touch.js"></script>
<!--<script src="assets/libs/angularjs/angular-mocks.js"></script>-->

<!-- Twitter Bootstrap -->
<script src="assets/libs/bootstrap/js/bootstrap.js"></script>

<!-- App files -->
<script src="app/app.js"></script>
<script src="app/components/home/homeController.js"></script>
<script src="app/components/program/programController.js"></script>
<script src="app/components/race-facts/race-factsController.js"></script>
<script src="app/components/food-and-drink/food-and-drinkController.js"></script>
<script src="app/components/some/someController.js"></script>
<script src="app/components/info/infoController.js"></script>
<script src="app/components/info/tickets/ticketsController.js"></script>
<script src="app/components/info/general-info/generalInfoController.js"></script>
<script src="app/components/info/meet-lahti/meetLahtiController.js"></script>
<script src="app/components/info/for-kids/forKidsController.js"></script>

	
<script>
$(function(){
	function showMenu(){
		 $('.row-offcanvas').toggleClass('active');
	};
	$("body").click(function(){
		console.log("ASDF");
	});
    $('[data-toggle="offcanvas"]').click(function () {
        $('.row-offcanvas').toggleClass('active')
    });
});
</script>
</body>
</html>